<!DOCTYPE html>

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <title>Bouncing Ball...</title>
    <script src="../raxan/startup.js" type="text/javascript"></script>
    <script src="views/scripts/css-bounce.js" type="text/javascript"></script>
    <style type="text/css">
    	#ball {position:relative}
    	#msgbox {position:relative; top: -50px;}
    </style>
</head>

<body>

	<div class="container c39 pad">
		<!-- Panel -->
		<div class="column c12 append1">
			<div class="rax-backdrop border">
				<div class="rax-content-pal hlf-pad round  border">
					<h5 class="pnl-header">Settings</h5>
					<div class="pad">
						<form id="frmSettings" name="frmSettings" action="bounce.html">
							<div class="ctrl-group">
								<label class="c6 left">Gravity:</label><input class="textbox" type="text" name="gravity" size="2" value="2.5"/>
							</div>
							<div class="ctrl-group">
								<label class="c6 left">Restitution:</label><input class="textbox" type="text" name="restitution" size="2" value="0.7"/>
							</div>
							<div class="ctrl-group">
								<label class="c6 left">Friction:</label><input class="textbox" type="text" name="friction" size="2" value="0.9"/>
							</div>
							<div class="ctrl-group">
								<label class="c6 left">Animate Box:</label><input type="checkbox" name="anibox" value="1" checked="checked" />
							</div>
							<hr />
							<button id="btnSave" class="button right">Save</button><br />
						</form>
					</div>
				</div>
			</div>
			<div id="msgbox" class="rax-box r1 ltm rtm back success">Settings Updated.</div>
		</div>

		<!-- Box -->
		<div id="box" class="column c20 r15 border clip1 ">
			<img id="ball" class="c1 r1 " src="views/images/ball.png" alt="Drag" />
		</div>

	</div>
</body>

</html>